<template>
	
	<view>
		<!-- <view style="position: fixed;top: 0rpx;height: 150rpx;background-color: aqua;width: 100%;">
			<view class="left" >
			  <image class="back-icon" src="/static/images/back.png" style="width: 80rpx;height: 80rpx;" @click="navigateBack"></image>
			</view>
		</view> -->
		<custom-navigation-bar title="我的地址"></custom-navigation-bar>
		<view class="address-list">
			<view class="address-wrap" v-for="(item,index) in addressList" :key="index" @click="returnAddress(item)">
				<view class="address-item">
					<view class="address-concats">
						<text class="name">{{item.contact}}</text>
						<view> <text>{{item.mobile}}</text> <text v-if="item.is_default" class="tag">默认</text></view>
					</view>
					<view class="address-info">
						{{item.addr_info}}
					<!-- 	{{item.city + item.street[0].name+item.name+ item.addr_info}} -->
					</view>
				</view>
				<view class="operate">
					<text>编辑</text>
				</view> 
			</view>
			<view class="add-address" >
				<text class="btn" @click="addAddress" >新建地址</text>
			</view>
		</view>
	</view> 
</template>

<script setup>
	import CustomNavigationBar from '@/components/CustomNavigationBar.vue'
	import http from '../../utils/http';
	const addressList = ref([{
		contact:'张三',
		mobile:'15905471111',
		is_default:1,
		addr_info:'金宇路76号济宁谢营科技大厦金宇路76号济宁谢营科技大厦金宇路76号济宁谢营科技大厦'
	},{
		contact:'张三',
		mobile:'15905471111',
		is_default:0,
		addr_info:'金宇路76号济宁谢营科技大厦'
	}])
	function addAddress(){
		console.log("111111")
		uni.navigateTo({
			url: "./addAddress"
		})
	}
	//返回上一页
	function returnAddress(item){
		//let beforePage = pages[pages.length - 2]; 
		const pages = getCurrentPages(); 
		const beforePage = pages[pages.length - 2];
		console.log(beforePage)
		if(beforePage){
			beforePage.$vm.$.exposed.setAddress(item) 
			uni.navigateBack(); 
		} 
	}
</script>

<style>
	Page{
	 background-color: #F2F2F2;
	}
	.tag{
		color: firebrick;
		border:2rpx solid firebrick;
		padding: 3rpx;
		border-radius: 10rpx;
	}
	.address-info{
		font-size: 23rpx;
		padding:10rpx;
		color:#999999 ;
	}
	.address-concats{
		width: 100%;
		float: left;
		font-size: 28rpx;
		line-height: 75rpx;
	}
	.name{
		width: 150rpx;
		float: left;
		text-align: center; 
	}
	.address-list{
		width: 90%;
		float: left;
		height: auto;
		margin-left: 5%;
		margin-top: 150rpx;
	}
	.address-wrap{
		width: 100%;
		float: left;
		height: auto;
		border-radius: 20rpx;
		background: white;
		margin-top: 20rpx; 
	}
	.address-item{
		width: 80%;
		height: 150rpx;
		float: left;
		font-size: 24rpx;
	}
	.operate{
		width: 18%;
		height: 70rpx;
		float: left;
		font-size: 30rpx;
		line-height: 70rpx;
		margin-top: 40rpx;
		border-left: 2rpx solid #F2F2F2;
		text-align: center;
		color:#2AE8DC ;
	}
	.add-address {
		position: fixed;
		bottom: 80rpx;
		width: 100vw;
	
	}
	
	.btn {
		display: inline-block;
		width: calc(100% - 60rpx);
		height: 93rpx;
		font-size: 30rpx;
		font-weight: 500;
		color: #FFFFFF;
		text-align: center;
		line-height: 93rpx;
		background: #2AE8DC;
		border-radius: 47px;
	}
</style>